let navigationData = [];

// 定义回调函数
function callback(data) {
  navigationData = data.navigationData;
  renderNavigationItems();
}

// 动态加载JS文件
function asyncLoadJs(src) {
  const script = document.createElement('script');
  script.src = src;
  document.body.appendChild(script);
}

function renderNavigationItems() {
  const container = document.getElementById('gridContainer');
  container.innerHTML = ''; // 清空容器
  
  // 从 localStorage 获取保存的顺序
  const savedOrder = JSON.parse(localStorage.getItem('navigationOrder') || '{}');
  
  // 应用保存的顺序或使用默认顺序
  const sortedData = navigationData.map(item => ({
    ...item,
    savedOrder: savedOrder[item.name] || item.order
  }));

  // 根据保存的顺序排序
  sortedData.sort((a, b) => a.savedOrder - b.savedOrder);

  sortedData.forEach(item => {
    const link = document.createElement('a');
    link.href = item.url;
    link.target = '_blank';
    link.style.textDecoration = 'none';
    link.draggable = true;

    const gridItem = document.createElement('div');
    gridItem.className = 'grid-item';

    // 添加拖拽事件
    link.addEventListener('dragstart', (e) => {
      gridItem.classList.add('dragging');
      e.dataTransfer.setData('text/plain', item.name);
    });

    link.addEventListener('dragend', (e) => {
      gridItem.classList.remove('dragging');
      
      // 更新顺序
      const newOrder = {...savedOrder};
      const items = [...container.children].map(link => {
        const nameDiv = link.querySelector('.name');
        return nameDiv.textContent;
      });
      
      // 更新顺序号
      items.forEach((name, index) => {
        newOrder[name] = index + 1;
      });
      
      // 保存到 localStorage
      localStorage.setItem('navigationOrder', JSON.stringify(newOrder));
    });

    link.addEventListener('dragover', (e) => {
      e.preventDefault();
      const draggingItem = container.querySelector('.dragging')?.parentNode;
      const currentItem = e.currentTarget;
      
      if (draggingItem && currentItem !== draggingItem) {
        const items = [...container.children];
        const currentIndex = items.indexOf(currentItem);
        const draggingIndex = items.indexOf(draggingItem);
        
        if (draggingIndex < currentIndex) {
          currentItem.after(draggingItem);
        } else {
          currentItem.before(draggingItem);
        }
      }
    });

    if (item.iconType === 'svg') {
      const iconWrapper = document.createElement('div');
      iconWrapper.className = 'icon';
      iconWrapper.innerHTML = item.icon;
      gridItem.appendChild(iconWrapper);
    } else if (item.iconType === 'image' && item.icon.startsWith('http')) {
      const iconWrapper = document.createElement('div');
      iconWrapper.className = 'icon';
      
      const img = document.createElement('img');
      img.src = item.icon;
      img.alt = item.name;
      
      iconWrapper.appendChild(img);
      gridItem.appendChild(iconWrapper);
    } else if (item.iconType === 'text' && item.iconText) {
      const iconWrapper = document.createElement('div');
      iconWrapper.className = 'icon text-icon';
      iconWrapper.textContent = item.iconText;
      gridItem.appendChild(iconWrapper);
    }

    const nameDiv = document.createElement('div');
    nameDiv.className = 'name';
    nameDiv.textContent = item.name;
    gridItem.appendChild(nameDiv);

    link.appendChild(gridItem);
    container.appendChild(link);
  });
}

asyncLoadJs('https://gitee.com/lisniuse/chatai-nav/raw/master/data.js');
asyncLoadJs('https://gitee.com/lisniuse/chatai-nav/raw/master/plugins/search.js');